/*var testData = [
    {text: "1【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg1.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg2.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg3.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg4.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg4.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg4.png"},
];
var testData1 = [
    {text: "2【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg1.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg2.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg3.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg4.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg4.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg4.png"},
];
var testData2 = [
    {text: "3【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg1.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg2.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg3.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg4.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg4.png"},
    {text: "【见微直播】2017武汉交警迎新年文艺汇演", img: "build/img/bg4.png"},
];*/

/**
 * 核心数组说明：
 * @type {number}
 * class:样式指定，与左侧栏目对应
 * name:栏目名称
 * data:从数据库取的列表
 * items:添加到预览区域的数据
 * limits:预览区域显示的限值
 */
var editNum = 0;
var sortedIDs = [];
var isGetData=new Array();
$.each(typesData,function(i,n){
    
    isGetData[n.tid]=false;
})

var list = new Vue({
    el: ".list",
    data: {
        index: 0,
        items: [],
        isShow: [],
        title: "栏目搜索",
        total:0,
        pagerObj:{
            currentPage: 1,
            totalPages: 1,
            pages: []
        },
        showpager:false
    },
    methods: {
        show: function (index) {
            // content.isEdit = false;
            list.isShow = [];
            list.isShow[index] = true;
            list.index = index;
        },
        add: function (val) {
            list.isShow = [];
            typesData[editNum].items.unshift(val);
            typesData[editNum].data.splice(list.index, 1);
        },
        cancel: function (index) {
            list.isShow = [];
        },
        setPage: function (page) {
            if (page < 1 || page > this.pagerObj.totalPages) {
                return;
            }
            getPage(typesData[editNum].tid,page);
        }
    }
});


var types = new Vue({
    el: ".types",
    data: {
        types: typesData
    }
});


var content = new Vue({
    el: ".content",
    data: {
        isEdit: false,
        contents: typesData,
        items: typesData[editNum].items,
    },
    methods: {
        click: function (value) {
            console.log(value);

            var cls = value.class;
            typesData.forEach(function (item, index) {
                if (item.class == cls) {
                    editNum = index;
                    list.title = item.name;
                    list.items = item.data;
                    getPage(item.tid,1);
                }
            })
        },
        reback: function (item, index) {
            var num = typesData[index].items.indexOf(item);
            typesData[index].items.splice(num, 1);
            typesData[index].data.splice(0, 0, item);
            list.title = typesData[index].name;
            list.items = typesData[index].data;
        }
    }
});

var control = new Vue({
    el: ".control",
    data: {
        // edit: false
    },
    methods: {
        onEdit: function () {
            // control.edit = true;
            content.isEdit = true;
            list.isShow = [];
            //sort();
            saveData();
        },
        onCancel: function () {
            // control.edit = false;
            // content.isEdit = false;
            content.isEdit = false;
            resetData();
        },
        save: function () {
            content.isEdit = false;

            var indexPage=new Array();
            /*$( ".sortitem" ).each(function(index){
                isGetData[$(this).attr('tid')]=false;
                indexPage[index]={tid:$(this).attr('tid'),item:$(this).find("li").map(function(){return $(this).data('aid');}).get()}; 
            });*/
            $( ".sortitem" ).each(function(index){
        isGetData[$(this).attr('tid')]=false;
        indexPage[index]={
            tid: $(this).attr('tid'),
            item: typesData[index].items.map(function(item){
                return item.aid;
                })}; 
});
            

            $.ajax({
                url:'saveIndexPage',
                data:{indexPage:indexPage},
                type:'post',
                async:false,
                success:function(data){
                    console.log(data);
                }
            })
        }
    }
});



/**
 * ajax 根据页面请求获取右侧列表
 *
 * @param page 页面编号，与栏目ID
 *
 * 返回： data:[
 *             data:{}, // 列表数据，结构参考testData
 *             total:100, // 总数
 *             pagesize:10 // 每页显示多少条
 *        ]
 */
function getPage(tid,page){
        $.ajax({
            url: "ajaxGetItems",
            type: "get",
            data: {
                tid: tid,
                p: page
            },
            async: true,
            success: function (data) {
                // get pagerObj object from service
                // 形成右侧列表
               isGetData[tid]=true;
                var arr = [];
                _.map(data.data,function(n){
                    arr.push(n);
                })
                list.items = arr.concat(typesData[editNum].data);
                list.pagerObj = getPager(data.total,page,data.pagesize);
                list.showpager = true;
            }
        })
}

function getPager(totalItems, currentPage, pageSize) {
    // calculate total pages
    var totalPages = Math.ceil(totalItems / pageSize);

    var startPage, endPage;
    if (totalPages <= 3) {
        // less than 10 total pages so show all
        startPage = 1;
        endPage = totalPages;
    } else {
        // more than 10 total pages so calculate start and end pages
        if(currentPage == 1){
            startPage = 1;
            endPage = 3;
        }else if(currentPage+1 >totalPages){
            startPage = currentPage -2;
            endPage = totalPages;
        }else{
            startPage = currentPage -1;
            endPage = currentPage +1;
        }
    }

    // calculate start and end item indexes
    var startIndex = (currentPage - 1) * pageSize;
    var endIndex = Math.min(startIndex + pageSize - 1, totalItems - 1);

    // create an array of pages to ng-repeat in the pager control
    var  pages = _.range(startPage, endPage+1);

    // return object with all pager properties required by the view
    return {
        totalItems: totalItems,
        currentPage: currentPage,
        pageSize: pageSize,
        totalPages: totalPages,
        startPage: startPage,
        endPage: endPage,
        startIndex: startIndex,
        endIndex: endIndex,
        pages: pages
    };
}

function saveData() {
     localStorage.clear();
     localStorage.setItem("typesData", JSON.stringify(typesData));
 }

function resetData(){
    typesData = JSON.parse(localStorage.getItem("typesData"));
    content.contents = typesData;
    list.items = typesData[editNum].data;
    // content.$forceUpdate();
}

/*function sort() {
    $(".sortitem").sortable({
        handle: ".img",
        create:function(event,ui){
            localStorage.clear();
            localStorage.setItem("typesData",JSON.stringify(typesData));
            // var num = event.target.getAttribute("data-value");
            // sortedIDsStart = $( ".sortitem" ).sortable( "toArray" );
            // tmpArray[num].start = sortedIDsStart;
        },
        update: function (event, ui) {
            // var num = event.target.getAttribute("data-value");
            sortedIDs = $( ".sortitem" ).sortable( "toArray" );
            console.log(sortedIDs);
            var tmp = [];
            sortedIDs.forEach(function(item,index){
                tmp[index] = typesData[editNum].items[item];
            });
            typesData[editNum].items = tmp;
            // tmpArray[num].stop = sortedIDsStop;
        }
    });
}

function unsort() {
    $(".sortitem").sortable( "cancel" );   
    $(".sortitem").sortable("destroy");
}*/